import { Table, Pagination } from 'antd';
import { useEffect, useState } from 'react';

import { filterStudentForms } from "api"

const { Column } = Table;

export default function Home() {
    // num(第几页)    pageSize (每页多少条)
    const [num, setnum] = useState(1)
    const [pageSize, setpageSize] = useState(8)
    const [count, setcount] = useState(0)
    const [data, setdata] = useState([])

    useEffect(() => {
        getpagedata(num, pageSize)
    }, [])

    const getpagedata = async (num, pageSize) => {
        let data = await filterStudentForms({
            num, pageSize
        })
        // console.log(data.data);
        if (data.code) {
            data.data.forEach((item, index) => {
                item.index = index
                item.key = item._id
            })

            setcount(data.count)
            setdata(data.data)
        }


        // console.log(data.data)
    }
    const onChange = async (num1, pageSize1) => {
        setnum(num1)
        setpageSize(pageSize1)

        getpagedata(num1, pageSize1)

    }

    return (
        <>
            <Table className="table_index" pagination={false} bordered={true} dataSource={data}>
                <Column width={50} title="" dataIndex="index" />
                <Column width={100} title="学号" dataIndex="work_xuehao" />
                <Column width={100} title="用户呢称" dataIndex="work_username" />
                <Column width={150} title="学院/专业" dataIndex="work_zhuanye" />
                <Column width={70} title="性别" dataIndex="work_sex" />
                <Column width={70} title="学历" dataIndex="work_xueli" />
                <Column width={100} title="就业情况" dataIndex="work_jiuye" />
                <Column width={60} title="毕业时间" dataIndex="work_biye_time" />
                <Column width={70} title="学制" dataIndex="work_xuezhi" />
                <Column width={200} title="单位名称" dataIndex="work_danwei" />
                <Column width={200} title="单位所在省份或市" dataIndex="work_dizhi" />
                <Column width={100} title="培养方式" dataIndex="work_fangshi" />
                <Column width={100} title="困难级别" dataIndex="work_kun_grade" />
                <Column width={200} title="生源地区" dataIndex="work_shengyuan" />
                
            </Table>
            <div style={{ textAlign: "center", margin: "20px 0" }}>
                <Pagination
                    onChange={onChange}
                    showSizeChanger
                    defaultCurrent={1}
                    defaultPageSize={10}
                    total={count}
                    current={num}
                    pageSize={pageSize}
                    pageSizeOptions={["8", "10", "15", "20"]}
                    showTotal={total => `共 ${count} 条`}
                />
            </div>
        </>
    )
}